<template>
    <!-- 为 ECharts 准备一个具备大小（宽高）的 DOM -->
    <div ref="barChart" class="bar-box"  style="width: 400px; height: 400px;"></div>
</template>

<script setup>
import {  onMounted, ref } from "vue";
import * as echarts from 'echarts'
const barChart = ref(null)
const myChart = ref(null)
const props = defineProps({
    option: {
        type: Object,
        default: () => ({})
    }
})


onMounted(() => {
        // 基于准备好的dom，初始化echarts实例
        myChart.value = echarts.init(barChart.value);
        // 使用刚指定的配置项和数据显示图表。
        myChart.value.setOption(props.option);

})
</script>

<style></style>